﻿<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>Gallery</title>
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<link rel="shortcut icon" type="image/png" href="favicon.png">
		<!---<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">--->
		<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
		<link rel="stylesheet" href="css/font-awesome.css" type="text/css" />
		<link rel="stylesheet" href="css/style.css" type="text/css" />
		<!--[if IE]>
		<script src="js/html5.js"></script>
		<![endif]-->
	</head>
	<body>
		<div id="page-preloader"><span class="spinner"></span></div>
		<header id="header" class="clear">
			<a href="index.html" class="logo">Matsumari</a>
			<div class="header-right">
				<div class="header-search">
					<i class="fa fa-search" aria-hidden="true"></i>
				</div>
			</div>
			<nav class="navbar">
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					</button>
				</div>
				<div id="navbar" class="navbar-collapse collapse">
					<ul class="nav navbar-nav menu">
						<li class="dropdown"><a href="index.html">Home</a></li>
						<li><a href="blog.html">Blog</a></li>
						<li><a href="gallery.html">Gallery</a></li>
						<li><a href="about_us.html">About Us</a></li>
						<li><a href="contacts.html">Contacts</a></li>
					</ul>
				</div>
			</nav>
		</header>
		<!-- header -->
		<div class="breadcrumbs-wrapper">
			<ul class="breadcrumbs">
				<li><a href="index.html" class="home"><i class="fa fa-home" aria-hidden="true"></i></a></li>
				<li><a>Gallery</a></li>
			</ul>
		</div>
		<!-- breadcrumbs-wrapper -->
		<section class="content-wrapper">
			<div class="container">
				<div class="title">
					<h1>Gallery</h1>
				</div>
				<div class="row">
					<div class="col-md-3 gallery-item">
						<a href="img/img1.jpg" data-lightbox="example-set"><img src="img/img1.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img2.jpg" data-lightbox="example-set"><img src="img/img2.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img3.jpg" data-lightbox="example-set"><img src="img/img3.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img4.jpg" data-lightbox="example-set"><img src="img/img4.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img5.jpg" data-lightbox="example-set"><img src="img/img5.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img6.jpg" data-lightbox="example-set"><img src="img/img6.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img7.jpg" data-lightbox="example-set"><img src="img/img7.jpg" alt=""></a>
					</div>
					<div class="col-md-3 gallery-item">
						<a href="img/img8.jpg" data-lightbox="example-set"><img src="img/img8.jpg" alt=""></a>
					</div>
				</div>
			</div>
		</section>
		<!-- content-wrapper -->
		<footer id="footer">
			<div class="container">
				<div class="row">
					<div class="col-md-4">
						<a href="index.html" class="logo">Matsumari</a>
						<p>Etiam dictum purus et leo laoreet, vel congue diam pulvinar. Suspendisse elementum dictum lacus id ultricies. In hac habitasse platea dictumst</p>
						<div class="copy">Copyright &copy; 2017.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></div>
					</div>
					<div class="col-md-3">
						<h6>Latest news</h6>
						<div class="news-footer">
							<a href="blog_inner.html">Praesent ullamcorper sodales</a>
							<div class="date">14.11.2016</div>
						</div>
						<div class="news-footer">
							<a href="blog_inner.html">Fusce sollicitudin felis vel</a>
							<div class="date">14.11.2016</div>
						</div>
						<div class="news-footer">
							<a href="blog_inner.html">Phasellus vitae dictum urna</a>
							<div class="date">14.11.2016</div>
						</div>
					</div>
					<div class="col-md-2">
						<h6>Best Posts</h6>
						<ul class="footer-menu">
							<li><a href="about_us.html">About us</a></li>
							<li><a href="">Sitemap</a></li>
							<li><a href="contacts.html">Contacts</a></li>
							<li><a href="blog.html">Blog</a></li>
							<li><a href="gallery.html">Gallery</a></li>
						</ul>
					</div>
					<div class="col-md-3">
						<h6>Contacts</h6>
						<address>Duis volutpat et magna quis congue. Nullam non velit porta, vulputate odio tempus, volutpat nibh. Mauris dictum dolor non interdum auctor</address>
						<div class="footer-phone"><i class="fa fa-phone" aria-hidden="true"></i> +1 (123) 456 78 90</div>
					</div>
				</div>
				<ul class="social">
					<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
					<li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
					<li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
					<li><a href="#"><i class="fa fa-youtube-play" aria-hidden="true"></i></a></li>
				</ul>
			</div>
		</footer>
		<!-- footer -->
		<!-- scripts -->	
		<script src="js/lib/jquery.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>
		<script src="js/lib/lightbox.min.js"></script>
		<script src="js/lib/shuffle.js"></script>	
		<script src="js/lib/swiper.min.js"></script>
		<script src="js/lib/waypoints.min.js"></script>		
		<script src="js/script.js"></script>
	</body>
</html>
